<template>
    <z-paging>
        <headsty :mrbot="'75'" @transmit="getkeyword" :leftImg="'../static/userpic/userhead.png'"></headsty>
        <view class="header_box">
            <template v-if="is_login">
                <view class="left_head_box">
                    <view class="left_zs_head_box">
                        <!-- <image
                        src=""
                        mode="scaleToFill"
                    /> -->
                    </view>
                    <view class="head_scenter_box">
                        <view class="head_topname_box">
                            <view class="left_namezs_box">烽火山林</view>
                            <view class="level_user_id_box">
                                <image src="../../static/user_levelid/1.png" mode="heightFix" />
                            </view>
                        </view>
                        <view class="user_ids_box">
                            <view class="user_id_zs_box">ID：10086</view>
                            <view class="copy_box">
                                <image src="../../static/userpic/copy.png" mode="scaleToFill" />
                            </view>
                        </view>
                    </view>
                </view>
            </template>
            <template v-else>
                <view class="left_head_box" @click="goLogin">
                    <view class="left_zs_head_box">
                        <!-- <image
                        src=""
                        mode="scaleToFill"
                    /> -->
                    </view>
                    <view class="head_scenter_box">
                        <view class="head_topname_box">
                            <view class="left_namezs_box1">登录/注册</view>
                        </view>
                    </view>
                </view>
            </template>

        </view>
    </z-paging>
</template>
<script>
import headsty from '../../components/indexhead.vue'
export default {
    components: {
        headsty
    },
    data() {
        return {
            is_login: false,//是否登录
            // keyword: '',
        }
    },
    methods: {
        // getkeyword(e) {
        //     this.keyword = e
        //     console.log(this.keyword)
        // }
        goLogin() {//去登陆
            this.$router('/userPage/login/login')
        }
    }
}
</script>
<style lang="scss" scoped>
.header_box {
    width: 100%;
    height: 120rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    padding: 0 30rpx;

    .left_head_box {
        display: flex;
        justify-content: flex-start;

        .left_zs_head_box {
            width: 120rpx;
            height: 120rpx;
            border-radius: 50%;
            background-color: #fff;
            margin-right: 21rpx;

            image {
                width: 100%;
                height: 100%;
                border-radius: 50%;
            }
        }

        .head_scenter_box {
            height: 120rpx;
            box-sizing: border-box;
            padding-top: 22rpx;

            .head_topname_box {
                height: 40rpx;
                display: flex;
                justify-content: flex-start;
                margin-bottom: 22rpx;

                .left_namezs_box {
                    width: 147rpx;
                    height: 40rpx;
                    font-family: PingFang SC;
                    font-weight: bold;
                    font-size: 36rpx;
                    color: #FFFFFF;
                    line-height: 40rpx;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    margin-right: 10rpx;
                }

                .left_namezs_box1 {
                    height: 80rpx;
                    font-family: PingFang SC;
                    font-weight: bold;
                    font-size: 36rpx;
                    color: #FFFFFF;
                    line-height: 80rpx;
                }

                .level_user_id_box {
                    height: 39rpx;

                    image {
                        height: 100%;
                    }
                }
            }

            .user_ids_box {
                height: 30rpx;
                display: flex;
                justify-content: flex-start;
                align-items: center;

                .user_id_zs_box {
                    height: 30rpx;
                    font-family: PingFang SC;
                    font-weight: 500;
                    font-size: 24rpx;
                    color: #FFFFFF;
                    line-height: 30rpx;
                    margin-right: 20rpx;
                }

                .copy_box {
                    height: 25rpx;
                    width: 25rpx;
                    display: flex;
                    justify-content: flex-start;
                    align-items: center;

                    image {
                        height: 100%;
                        width: 100%;
                    }
                }
            }
        }
    }
}
</style>